<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>学生列表</title>  
    <link rel="stylesheet" href="styles.css">  
</head>  
<body>  
	<h3>
		<span><span id="admin-name"></span>教务，你好。</span><button id="logoutBtn">注销</button>
	</h3>
	<main>
    <div class="container">  
		<h3><span id="total"></span><button id="createBtn">创建学生</button></h3>
        <div class="student-list">  
            <!-- 学生列表将在这里动态生成 -->  
        </div>  
  
        <div class="pagination">  
            <!-- 分页控件将在这里动态生成 -->  
        </div>  
    </div>  
	</main>
	
	<!-- 学生信息模态对话框 -->  
	<div id="studentModal" class="modal">  
	  <div class="modal-content">  
	    <span class="close">&times;</span>  
	    <form id="studentForm">  
	      <label for="name">姓名:</label>
	      <input type="text" id="name" name="name" required><br>  
	      <label for="id">学号:</label>
	      <input type="text" id="id" name="id" required><br>  
	      <label for="sex">性别:</label> 
	      <input type="text" id="sex" name="sex" required><br>  
	      <input type="submit" value="创建">  
	    </form>  
	  </div>  
	</div>  
  
    <script src="script.js"></script>  
</body>  
</html>